<script setup lang="ts">
/*
  socket.io-client
  1:下载  yarn add socket.io-client
  2:导入 import io from 'socket.io-client'
  3:建立连接  const socket=io(传参(url地址，参数))
  4:判断是否连接成功   connect事件
  5:监听消息接收   默认  message  socket.on('message',(data)=>{})
  6:发送消息   socket.emit('message',数据)
  7:关闭  socket.close()
  8:判断关闭是否成功  disconnect事件

*/
import io from 'socket.io-client'
import { ref } from 'vue'
const socket = io('ws://119.91.150.211:1235')
socket.on('connect', () => {
  console.log('连接成功')
})
socket.on('message', data => {
  console.log('收到消息:', data)
})
const msg = ref<string>('')
const send = () => {
  socket.emit('message', msg.value)
}
const close = () => {
  socket.close()
}
socket.on('disconnect', () => {
  console.log('关闭连接了')
})
</script>

<template>
  <div class="play-page">
    <input type="text" v-model="msg" />
    <button @click="send">发送</button>
    <button @click="close">关闭连接</button>
  </div>
</template>

<style lang="scss" scoped></style>
